<template>
    <list class="body">
        <cell class="p_lr_36" style="padding-bottom: 60px;">
           <div class="m_t_30">
               <text class="font_30">数英指数 D.INDEX 是由数英 DIGITALING 基于营销机构在数英平台的活跃度、项目品质、人气、行业认可度等多维度数据推出的指数型工具，用于评估营销机构的综合实力。

在数英指数的计算中，我们使用在上一年度时间范围内的以下指标作为原始数值，再将这些数值百分化并进行加权处理之后，得到百分化的数英指数。
               </text>
           </div>
        </cell>
        <cell class="p_lr_36" v-for="item in title_cell">
            <div class="header_cell">
                <image v-bind:src="item.img" style="width: 58px; height: 58px;"></image>
                <div class="info">
                    <text class="font_30 color_f36 lineH_58">{{item.title}}</text>
                    <div class="m_t_5">
                        <text class="font_30 lineH_38">{{item.content}}</text>
                    </div>
                </div>
            </div>
        </cell>

        <cell @click="cateClick">
            <div class="cate m_t_30">
                <div class="cate_info p_lr_36">
                    <text class="section_tit font_30">奖项分类说明</text>
                    <image src="xcassets:icon_more_down" style="width: 30px; height: 30px;"></image>
                </div>
            </div>
        </cell>

        <!-- 奖项分类说明-->
        <cell class="cate_show p_lr_36" v-if="cate_show">
            <div class="m_b_30">
                <div class="m_b_30"><text class="font_30 color_f36">01.综合类</text></div>
                <div class="header_cell"  v-for="item in cate_cell">
                    <image v-bind:src="item.img" style="width: 58px; height: 58px;"></image>
                    <div class="info">
                        <text class="font_30 color_f36 lineH_58">{{item.title}}</text>
                        <div class="m_t_5">
                            <text class="font_30 lineH_38">{{item.content}}</text>
                        </div>

                        <div class="m_t_10">
                            <text class="font_23 color_999">{{item.desc}}</text>
                        </div>
                    </div>
                </div>
            </div>
            <div class="m_b_30">
                <div class="m_b_30"><text class="font_30 color_f36">01.行业类</text></div>
                <div><text class="font_30">以营销机构项目所属客户的行业性质为分类依据，列举了当下较有代表性的几个行业子类。该分类能够代表营销机构在特定行业的服务表现。</text></div>
            </div>

            <div class="m_b_30">
                <div class="m_b_30"><text class="font_30 color_f36">01.地区类</text></div>
                <div><text class="font_30">以营销机构的办公地域为分类依据，目前划分为北京、上海、广东、浙江四个地区。</text></div>
            </div>

        </cell>

        <cell @click="indexClick">
            <div class="cate">
                <div class="cate_info p_lr_36">
                    <text class="section_tit font_30">提升数英指数有什么好处</text>
                    <image src="xcassets:icon_more_down" style="width: 30px; height: 30px;"></image>
                </div>
            </div>
        </cell>

        <!-- 数英指数-->
        <cell class="index_show p_lr_36" v-if="index_show">
            <div class="m_b_30"><text class="font_30">数英指数以营销案例为主要监测对象，直观反映营销机构的综合实力。较高的数英指数，将会成为广告主选择营销机构的重要参考指标，也是营销机构自身了解业界格局的绝佳窗口。</text></div>
        </cell>

        <cell @click="listClick">
            <div class="cate">
                <div class="cate_info p_lr_36">
                    <text class="section_tit font_30">如何进入榜单／提升排名</text>
                    <image src="xcassets:icon_more_down" style="width: 30px; height: 30px;"></image>
                </div>
            </div>
        </cell>

        <!-- 如何进入榜单-->
        <cell class="list_show p_lr_36" v-if="list_show">
            <div class="header_cell m_b_30"  v-for="item in list_cell">
                <image v-bind:src="item.img" style="width: 58px; height: 58px;"></image>
                <div class="info">
                    <text class="font_30 color_f36 lineH_58">{{item.title}}</text>
                    <div class="m_t_5">
                        <text class="font_30 lineH_38">{{item.content}}</text>
                    </div>
                </div>
            </div>
        </cell>

        <cell @click="zanClick">
            <div class="cate">
                <div class="cate_info p_lr_36">
                    <text class="section_tit font_30">点赞（投票）机制</text>
                    <image src="xcassets:icon_more_down" style="width: 30px; height: 30px;"></image>
                </div>
            </div>
        </cell>

        <!-- 点赞机制-->

        <cell class="zan_show p_lr_36" v-if="zan_show">
            <div class="m_b_30"><text class="font_30">数英用户对企业点赞投票的数量，会在一定程度上影响数英指数的排名。</text></div>
            <div class="header_cell m_b_30"  v-for="item in zan_cell">
                <image v-bind:src="item.img" style="width: 58px; height: 58px;"></image>
                <div class="info">
                    <div>
                        <text class="font_30 lineH_38">{{item.content}}</text>
                    </div>
                </div>
            </div>
        </cell>

        <cell @click="aboutClick">
            <div class="cate">
                <div class="cate_info p_lr_36">
                    <text class="section_tit font_30">关于年度营销机构奖项</text>
                    <image src="xcassets:icon_more_down" style="width: 30px; height: 30px;"></image>
                </div>
            </div>
        </cell>

        <!-- 关于年度奖项-->
        <cell class="about_show p_lr_36" v-if="about_show">
            <div class="header_cell m_b_30"  v-for="item in about_cell">
                <image v-bind:src="item.img" style="width: 58px; height: 58px;"></image>
                <div class="info">
                    <div>
                        <text class="font_30 lineH_38">{{item.content}}</text>
                    </div>
                </div>
            </div>
        </cell>


        <cell @click="awardClick">
            <div class="cate">
                <div class="cate_info p_lr_36">
                    <text class="section_tit font_30">奖项设置</text>
                    <image src="xcassets:icon_more_down" style="width: 30px; height: 30px;"></image>
                </div>
            </div>
        </cell>

        <!-- 奖项设置-->
        <cell class="award_show p_lr_36" v-if="award_show">
            <div class="m_b_30" v-for="item in award_cell">
                <div class="m_b_30"><text class="font_30">{{item.title}}</text></div>
                <div class="header_cell  m_t_5"  v-for="award in item.content">
                    <image v-bind:src="award.img" style="width: 58px; height: 58px;"></image>
                    <div class="award">
                        <text class="font_30 color_f36 lineH_58">{{award.title}}</text>
                        <text class="font_30 color_f36 lineH_58">{{award.count}}</text>
                    </div>
                </div>
            </div>
        </cell>


        <cell @click="wellClick">
            <div class="cate">
                <div class="cate_info p_lr_36">
                    <text class="section_tit font_30">奖项福利</text>
                    <image src="xcassets:icon_more_down" style="width: 30px; height: 30px;"></image>
                </div>
            </div>
        </cell>

        <!-- 奖项福利-->
        <cell class="well_show p_lr_36" v-if="well_show">
            <div class="m_b_30" v-for="item in well_cell">
                <div class="m_b_20 m_l_86"><text class="font_30 color_f36">{{item.title}}</text></div>
                <div class="header_cell" v-for="well in item.content">
                    <image v-bind:src="well.img" style="width: 58px; height: 58px;"></image> 
                    <div class="info">
                        <text class="font_30">{{well.title}}</text>
                        <div class="m_t_10">
                            <text class="font_23 color_999">{{well.desc}}</text>
                        </div>
                    </div>
                </div>
            </div>
        </cell>

        <cell @click="problemClick">
            <div class="cate">
                <div class="cate_info p_lr_36">
                    <text class="section_tit font_30">如有疑问或需要帮助</text>
                    <image src="xcassets:icon_more_down" style="width: 30px; height: 30px;"></image>
                </div>
            </div>
        </cell>

        <!-- 疑问帮助-->
        <cell class="problem_show p_lr_36" v-if="problem_show">
            <div class="header_cell m_b_30" v-for="item in problem_cell">
                <image v-bind:src="item.img" style="width: 58px; height: 58px;"></image> 
                <div class="info">
                    <text class="font_30">{{item.title}}</text>
                </div>
            </div>
        </cell>
    </list>
</template>

<style>
    .p_lr_36 {padding-left: 36px; padding-right: 36px;}
    .color_f36 {color: #ff3366}
    .color_999 {color: #999}
    .font_30 {font-size: 30px;}
    .font_23 {font-size: 23px;}
    .lineH_58 {line-height: 58px;}
    .lineH_38 {line-height: 38px;}
    .m_t_5 {margin-top: 5px;}
    .m_t_10 {margin-top: 10px;}
    .m_t_30 {margin-top: 30px;}
    .m_b_30 {margin-bottom: 30px;}
    .m_b_20 {margin-bottom: 20px;}
    .m_l_86 {margin-left: 86px;}


    .body {background: #fff;}

    .header_cell {flex-direction: row}
    .info {margin-left: 28px; width: 592px; margin-bottom: 20px;}
    .award {margin-left: 28px; width: 592px; flex-direction: row; justify-content: space-between;}

    .cate {height: 130px;  background-color: #f0f0f0; padding-top: 0px;}
    .cate_info {height: 110px; background-color: #fff;  position: absolute; bottom: 0px; left: 0; width: 750px; flex-direction: row; justify-content: space-between; align-items: center}
</style>

<script>
    export default {
        data: {
            cate_show :false,
            index_show :false,
            list_show :false,
            zan_show :false,
            about_show :false,
            award_show :false,
            well_show :false,
            problem_show :false,

            title_cell: [
                {img: 'xcassets:dabout_icon1', title: '项目数量', 'content': '企业在数英平台发布的项目数，含认领的项目。'},
                {img: 'xcassets:dabout_icon2', title: '收录', 'content': '发布的项目中被数英收录的项目总量，含认领的项目。'},
                {img: 'xcassets:dabout_icon3', title: '项目品质', 'content': '发布项目中的被选为精选项目的总量及项目的关注度。'},
                {img: 'xcassets:dabout_icon4', title: '客户数', 'content': '企业在数英平台发布的项目中体现的服务的品牌客户的数量。（不计权重）'},
                {img: 'xcassets:dabout_icon5', title: '关注度', 'content': '企业在数英平台帐号的关注度。'},
                {img: 'xcassets:dabout_icon6', title: '赞数', 'content': '数英用户对企业点赞投票的数量。'}
            ],
            cate_cell: [
                {img: 'xcassets:dabout_icon7', title: 'TOP List总榜', 'content': '涵盖了所有进入数英指数排名的营销机构。', desc: ''},
                {img: 'xcassets:dabout_icon8', title: '综合代理商', 'content': '大而全 - 实力强大、提供全业务营销服务的大型、综合型营销机构。', desc: ''},
                {
                    img: 'xcassets:dabout_icon9',
                    title: '新锐热店',
                    'content': '小而美 - 在特定营销领域成绩出色、术业有专攻的中小型营销机构。近年来大中华区崭露头角的传播业新星也将被加入此分组。',
                    'desc': ''
                },
                {
                    img: 'xcassets:dabout_icon10',
                    title: '媒体公关',
                    'content': '在媒介、公关、技术工具以及社交媒体业务上份额较大的营销机构。',
                    desc: '注： 欲入选数英指数综合分类（除总榜外）的营销机构，需使用该机构数英企业帐号，发布累计5个近1年内上线的营销项目，并私信D.Service客服号，告知申请入选数英指数综合类。您也可以在发布完项目后，发邮件至dindex@digitaling.com，邮件标题请参照如下格式：“企业名称+申请加入数英指数综合类”，内文中附上企业数英帐号。数英将在3个工作日内进行审核，并以私信的方式告知企业结果。'
                }
            ],
            list_cell: [
                {
                    img: 'xcassets:dabout_icon11',
                    title: '获得企业账号',
                    'content': '免费申请“数英企业帐号”是企业进入数英指数榜单的唯一渠道。已有企业帐号的企业用户可直接登录，无需重复申请。若您忘记了企业帐号密码可通过忘记密码功能找回。'
                },
                {
                    img: 'xcassets:dabout_icon11',
                    title: '发布项目',
                    'content': "候选企业过去一年中创作的营销项目将是影响数英指数高低的最大因素。\n发布更多项目并被数英收录将有助于提升指数排名并对企业获得更多潜在客户、从业者、人才的关注，提高业界知名度产生正面的影响。\n优质项目将有可能被数英免费收录推广。得到更多的收录，在提升排名上会有更大的帮助。"
                }
            ],
            zan_cell: [
                {img: 'xcassets:dabout_icon12', content: '每位数英注册用户均可为任意一个企业点赞；'},
                {img: 'xcassets:dabout_icon12', content: '每位注册用户一天内至多为同一个企业点赞一次；'},
                {img: 'xcassets:dabout_icon12', content: '数英网将尽可能排除恶意刷赞等作弊手段；'}
            ],
            about_cell: [
                {img: 'xcassets:dabout_icon12', content: 'DAOY 2016 数英年度数字营销机构，是由数英 DIGITALING 发起的、完全公益性质的行业奖项。'},
                {
                    img: 'xcassets:dabout_icon12',
                    content: '我们旨在通过这一奖项，鼓励在过去一年中，在大中华区为广告主和消费者创作了精彩传播案例的数字营销机构，提高其在行业内的知名度，并期望以此推动大中华区整个数字传播行业的健康发展。'
                },
                {img: 'xcassets:dabout_icon12', content: '企业名单由数英DIGITALING审核并分组，评选期间数英指数最高的候选企业即为优胜者。数英指数是该榜单排名的唯一依据。'},
                {img: 'xcassets:dabout_icon12', content: 'DAOY 2016 数英年度数字营销机构奖项评选截止日期为：2017年2月22日。'}
            ],
            award_cell: [
                {
                    title: '',
                    content: [
                        {img: 'xcassets:dabout_icon7', title: '年度最佳营销机构', count: 'X3'},
                    ]
                },
                {
                    title: '01.综合类',
                    content: [
                        {img: 'xcassets:dabout_icon8', title: '年度综合营销机构', count: 'X3'},
                        {img: 'xcassets:dabout_icon9', title: '年度新锐营销机构', count: 'X3'},
                        {img: 'xcassets:dabout_icon10', title: '年度媒介公关机构', count: 'X3'}
                    ]
                },
                {
                    title: '02.行业类',
                    content: [
                        {img: 'xcassets:dabout_icon11', title: '互联网领域年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '数码电器领域年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '电商零售领域年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '汽车领域年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '服饰领域年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '运动领域年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '护肤日化领域年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '食品领域年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '酒类领域年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '金融领域年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '酒店航旅领域年度最佳营销机构', count: 'X1'},
                    ]
                },

                {
                    title: '03.地区类',
                    content: [
                        {img: 'xcassets:dabout_icon11', title: '北京区年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '上海区年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '广东区年度最佳营销机构', count: 'X1'},
                        {img: 'xcassets:dabout_icon11', title: '浙江区年度最佳营销机构', count: 'X1'},
                    ]
                }
            ],
            well_cell: [
                {
                    title: '入围奖（名额50个）',
                    content: [
                        {img: 'xcassets:dabout_icon12', title: '综合类“年度最佳营销机构”入围企业可免费获得数英职位发布5个', desc: ''}
                    ]
                },
                {
                    title: '最终奖（名额依据奖项设置）',
                    content: [
                        {img: 'xcassets:dabout_icon12', title: '获奖机构可免费获得数英职位发布20个', desc: ''},
                        {img: 'xcassets:dabout_icon12', title: '获奖企业可免费获得项目收录3次（内容需审核）', desc: ''},
                        {
                            img: 'xcassets:dabout_icon12',
                            title: '获奖企业可免费开通热门企业推广1个月（申请开通有效期自获奖通知后3个月，逾期作废）',
                            desc: '注：所有获奖营销机构将会在活动结束后，收到数英站内私信通知并领取相应获奖福利。\n以上奖项的获奖名单可能会有一定重合。获奖福利不互相叠加，获奖营销机构可以任选一个已获奖福利。'
                        }
                    ]
                }
            ],
            problem_cell: [
                {img: 'xcassets:dabout_icon12', title: '如果您对数英企业帐号、数英指数或 DAOY 有任何疑问或需要得到我们的帮助，欢迎通过发送私信或邮件的方式联系我们。'},
                {img: 'xcassets:dabout_icon12', title: '邮件标题请参照如下格式：“企业帐号+需要解决的问题”，例如“North Kingdom 上海，企业帐号无法登录”。'},
                {img: 'xcassets:dabout_icon12', title: '您也可以通过“联系我们”中的其他方式联系我们。'}
            ]
        },
        methods: {
            cateClick: function(e) {
                this.cate_show = !this.cate_show;
            },
            indexClick: function(e) {
                this.index_show = !this.index_show;
            },
            listClick: function(e) {
                this.list_show = !this.list_show;
            },
            zanClick: function(e) {
                this.zan_show = !this.zan_show;
            },
            aboutClick: function(e) {
                this.about_show = !this.about_show;
            },
            awardClick: function(e) {
                this.award_show = !this.award_show;
            },
            wellClick: function(e) {
                this.well_show = !this.well_show;
            },
            problemClick: function(e) {
                this.problem_show = !this.problem_show;
            }
        }
    }
</script>